<template>
	<view class="container">
		<hr class="chr"/>
		<div class="rowborder">
			<div style="display: flex;">
				<button size="mini" type="default" @click="openshowPopup">新建</button>
				<picker mode="date" :value="query.ddate" @change="bindDateChange"  class="topborder">
					<text class="itemth">日期:</text><text class="inputborder">{{query.ddate}}</text>
				</picker>
			</div>
			<div class="billflex">
				<view class="itembillth">单号:</view>
				<uni-easyinput  placeholder="请输入单号" v-model="query.ccode" class="inputbill" ></uni-easyinput>
				<uni-easyinput  placeholder="生产单号" v-model="query.csocode" class="inputbill" ></uni-easyinput>
				<button size="mini" type="default" @click="findAll">查询</button>
			</div>
		</div>
		<hr class="chr"/>
		<view v-for="item,index in datas" v-bind:key="index">
			<navigator :url="'../rpincome/index?id='+item.id" class="navborder">
				<view style="color: #ff0000;float: right;margin: 20upx;">{{item.measurement}}</view>
				<view style="display: flex;">
					<view style="width: 300px;"><text class="itemth">单号:</text><text class="itmemain">{{item.ccode}}</text></view>
					<view><text class="itemth">生产单号:</text><text class="itmemain">{{item.csocode}}</text></view>
				</view>
				<view style="display: flex;">
					<view style="width: 300px;"><text class="itemth">编码:</text><text class="itmemain">{{item.cinvcode}}</text></view>
					<view><text class="itemth">产品:</text><text class="itmemain">{{item.cinvname}}</text></view>
				</view>
				<view style="display: flex;">
					<view style="width: 300px;"><text class="itemth">总数/已检数:</text><text class="itmemain">{{item.qty}}/{{item.qcyqty}}</text></view>
					<view ><text class="itemth">部门名称:</text><text class="itmemain">{{item.cdepname}}</text></view>
				</view>
				<view style="display: flex;">
					<view style="width: 300px;"><text class="itemth">创建人:</text><text class="itmemain">{{item.createBy}}</text></view>
					<view><text class="itemth">创建时间:</text><text class="itmemain">{{item.createTime}}</text></view>
				</view>
			</navigator>
		</view>
		
		
		<uni-popup ref="showPopup" type="center" :animation="false" :mask-click="false">
			<view style="background-color: #FFFFFF;width: 600upx;height: 280upx;padding: 40upx;margin-top: 60upx;">
				<div class="rowborder">
					<div class="billflex">
						<button size="mini" type="default" @click="closeshowPopup()">取消</button>
						<uni-easyinput style="width: 120upx;" placeholder="单号" v-model="queryPo.ccode" class="inputbill"></uni-easyinput>
						<uni-easyinput style="width: 120upx;" placeholder="销售单号" v-model="queryPo.csocode" class="inputbill"></uni-easyinput>
						<button size="mini" type="default" @click="findIncomepo()">查询</button>
						<div><uni-icons style="margin-left: 50rpx;" type="scan" size="30" @click="scan()"></uni-icons></div>
					<!-- #ifdef H5 -->
						<uni-easyinput style="width: 120upx;" placeholder="二维码" v-model="queryPo.cbarcode" class="inputbill"></uni-easyinput>
						<button size="mini" type="default" @click="h5input()">二维码查询</button>
					<!-- #endif -->
					</div>
				</div>
				<view>
					<scroll-view scroll-y="true" class="scroll-Y" >
						<uni-list>
							<uni-list-item v-for="(item, index) in podate" v-bind:key="index" style="height: 100px;" showArrow="true">
								<view slot="body" @click="selBill(index)">
									<view style="display: flex;">
										<view style="width: 200upx;">
											<text>单号：{{ item.cCode }}</text>
										</view>
										<view style="width: 200upx;">
											<text>销售单号：{{ item.csocode }}</text>
										</view>
									</view>
									<view style="display: flex;">
										<view style="width: 200upx;">
											<text>数量：{{ item.iQuantity }}</text>
										</view>
										<view >
											<text>产品名称：{{ item.csoinvname }}</text>
										</view>
									</view>
								</view>
							</uni-list-item>
						</uni-list>
					</scroll-view>
				</view>
			</view>
		</uni-popup>
		
		<uni-popup ref="showPPbarcode" type="center" :animation="false" :mask-click="false">
			<view style="background-color: #FFFFFF;width: 600upx;height: 280upx;padding: 40upx;margin-top: 60upx;">
				<view class="rowborder">
					<view>
						<button size="mini" type="default" @click="closeshowPPbarcode">取消</button>
						<button size="mini" type="default" @click="selBarcodes">确定</button>
						<button size="mini" type="default" @click="selcheck">全选</button>
					</view>
				</view>
				<view>
					<scroll-view scroll-y="true" class="scroll-Y">
						<uni-list>
							<uni-list-item v-for="(item, index) in barcodeDatas" v-bind:key="index" :showSwitch="(!item.isqc || item.isqc =='返工' ) && item.isclose != 1" @switchChange="item.checked = !item.checked" :switchChecked="item.checked">
								<view slot="body">
									<view style="display: flex;">
										<view style="width: 300upx;">
											<text>条码：{{ item.cbarcode }}--{{ item.kbno }}</text>
										</view>
										<view style="display: flex;width: 130upx;">
											<text>数量：{{item.qty}}</text>
<!-- 											<view v-show="item.qctime|| item.stepvalue =='质检'" style="margin-left: 5rpx;">
												<button  size="mini" type="default" @click="showBill(item.cbarcode)">查看</button>
											</view> -->
										</view>
										<view v-show="item.isqc && item.isclose != 1" style="margin-left: 5rpx;">
											<button  size="mini" type="default" @click="showBill(item.cbarcode)">查看</button>
										</view>
										<view>
											<text style="font-size: 20rpx;color:#f10000;">{{ item.isclose == 1 ? '作废':'' }}</text>
										</view>
									</view>
								</view>
							</uni-list-item>
						</uni-list>
					</scroll-view>
				</view>
			</view>
		</uni-popup>
	</view>
</template>

<script>
import selectBox from '../../components/select-box/select-box.vue'
	export default {
		components:{
			selectBox
		},
		created() {
			
			this.findAll();
			this.query.ddate = this.getNowFormatTime();
		},
		onShow(){
			if(this.autoid){
				this.findBarcodesByAutoId()
			}
		},
		data() {
			return {
				showPPbarcode:false,
				showPopup:false,
				datas:[],
				barcodeDatas:[],
				query:{
					pageIndex:1,
					pageSize:100,
					ddate:'',
					ccode:'',
					csocode:''
				},
				podate:[],
				queryPo:{
					pageIndex:1,
					pageSize:100,
					ccode:'',
					csocode:'',
					cbarcode:''
				},
				autoid:''
			}
		},
		methods: {
			openshowPPbarcode(){
				this.$refs.showPPbarcode.open();
			},
			closeshowPPbarcode(){
				this.$refs.showPPbarcode.close();
			},
			openshowPopup(){
				this.$refs.showPopup.open();
			},
			closeshowPopup(){
				this.$refs.showPopup.close();
			},
			navTo(){
				uni.navigateTo ({
					url: '/pages/rpincome/index'
				});
			},
			findIncomepo(){
				this.$http.post(
					"incomep/query",
					this.queryPo
				).then(res=>{
					this.podate = res.data.data.page.content
				})
			},
			selBill(index){
				this.autoid = this.podate[index].AutoID
				this.findBarcodesByAutoId()
				this.closeshowPopup()
				this.openshowPPbarcode()
			},
			selBarcodes(){
				let data = []
				for(const item of this.barcodeDatas){
					if(item.checked){
						data.push({cbarcode:item.cbarcode,kbno:item.kbno,qty:item.qty})
					}
				}
				if(data.length > 0){
					uni.navigateTo({
						url: '../rpincome/index?autoid=' 
						+ this.autoid + 
						'&barcodes=' + JSON.stringify(data)
					});
				}
			},
			selcheck(){
				for(const item of this.barcodeDatas){
					if(!item.isu8){
						item.checked = true
					}
				}
				this.$forceUpdate()
			},
			showBill(cbarcode){
				this.$http
					.get('rpInCome/findRpIncomeBySubBarcode', {
						cbarcode: cbarcode
					})
					.then(res => {
						if (res.data.data.data) {
							const item = res.data.data.data;
							uni.navigateTo({
								url: '../rpincome/index?id=' + item.id
							});
						} else {
							uni.showToast({
								title: '条码不存在',
								icon: 'error'
							});
						}
					});
			},
			findBarcodesByAutoId(){
				this.$http.get(
					"cgbarcode/findAllByAutoId",
					{autoid:this.autoid}
				).then(res=>{
					const data = res.data.data.page
					for(const item of data){
						item.checked = false
						//为了不改变代码逻辑，把标签的数量名称thisqty 转为qty
						item.qty = item.thisqty
					}
					this.barcodeDatas = data
					
				})
			},
			findAll(){
				let data ={
					ddate:this.query.ddate
				}
				if(this.query.csocode||this.query.ccode){
					data = {
						csocode:this.query.csocode,
						ccode:this.query.ccode
					}
				}
				this.$http.post(
					"rpInCome/query",
					data
				).then(res=>{
					this.datas = res.data.data.page.content
				})
			},
			dateSelect(e){
				console.log(e)
			},
			bindDateChange(e){
				this.query.ddate = e.detail.value
				this.findAll()
			},
			getBarcode(barcode) {
				this.$http
					.get('cgbarcode/findByBarcode', {
						barcode: barcode
					})
					.then(res => {
						if (res.data.data.page) {
							const item = res.data.data.page;
							this.queryPo.csocode = item.csocode
							this.autoid = item.autoid
							this.findBarcodesByAutoId()
							this.findIncomepo()
							this.closeshowPopup()
							this.openshowPPbarcode()
						} else {
							uni.showToast({
								title: '条码不存在',
								icon: 'error'
							});
						}
				});
			},
			h5input(){
				this.getBarcode(this.queryPo.cbarcode)
			},
			scan() {
				
				let there = this;
				uni.scanCode({
					onlyFromCamera: true,
					success: function(res) {
						console.log('条码内容：' + res.result);
						there.getBarcode(res.result);
					},
					fail:function(res){
						uni.showToast({
							title: '识别失败',
							icon: 'error'
						});
					}
				});
			},
			getNowFormatTime() {
				let date = new Date();
				let seperator1 = "-";
				let year = date.getFullYear();
				let month = date.getMonth() + 1;
				let strDate = date.getDate();
				if (month >= 1 && month <= 9) {
					month = "0" + month;
				}
				if (strDate >= 0 && strDate <= 9) {
					strDate = "0" + strDate;
				}
				let currentdate = year + seperator1 + month + seperator1 + strDate;
				return currentdate;
			}
		}
	}
</script>

<style>
	.scroll-Y{
		height: 250upx;
	}
	.container {
		font-size: 20px;
		background-color: #3884fd;
	}
	.chr{
		height:1upx;
		border:none;
		border-top:1upx solid #d2f1ff;
	}
	.unigriditem{
		text-align:center;
		text-justify: auto;
		margin: auto auto;
	}
	.itemth{
		padding: 1upx 10upx;
		font-size: 10rpx;
	
	}
	.itembillth{
		margin-top: 10upx;
		font-size: 10upx;
	}
	.itmemain{
		font-size: 15rpx;
		color: #2480a7;
	}
	.topborder{
		margin: 2rpx 20rpx;
	}
	.inputborder{
		background-color: #ffffff;
		border-color: #d2f1ff;
		background-color: #d2f1ff;
		padding: 3rpx 10rpx;
		border-width: 0.5rpx;
		border-style:solid;
		border-radius: 8rpx;
	}
	.rowborder{
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		margin: 3rpx;
	}
	.billflex{
		display: flex;
		flex-direction: row;
		margin-right: 30rpx;
	}
	.navborder{
		background-color: #d2f1ff;
		padding: 1rpx;
		margin: 2rpx 10rpx;
		border-color: #eff8ff;
		border-width: 0.5rpx;
		border-style:solid;
		border-radius: 8rpx;
	}
	.inputbill{
		border-color: #eff8ff;
		border-width: 0.5rpx;
		border-style:solid;
		border-radius: 8rpx;
		width: 130rpx;
		margin-right: 5rpx;
		background-color: #d2f1ff;
	}
</style>
